iT邦幫忙

2026 iThome 鐵人賽

DAY 9
0

大家好!今天要來介紹函式(Function),事不宜遲,讓我們省略廢話,趕快開始吧!


函式(Function)

定義:函式是一段具有特定功能、可以被重複呼叫執行的程式碼。函式可以接收參數,也可以回傳結果。

//在TypeScript中,函式的宣告方法如範例所示:
function multiply(a: number, b: number): number {
	return a*b;
}
//宣告公式:function 函式名稱(參數1:型別, 參數2:型別): 回傳型別 { 函式本體 }

const A = multiply(10, 20);
console.log(A); //輸出:200

如果函式不需要回傳結果(例如:遊戲更新畫面),回傳型別該怎麼寫?
會使用void作為回傳型別,至於void是什麼?我們在第11天會來談談TS的特殊型別,到時就會談到它了

函式參數

當我們有一段需要重複執行的程式碼時,可以把它寫成函式。而函式參數則可以讓我們在呼叫函式的時候,傳入不同的資料,讓同一個函式處理不同的情況。

function cart(product: string, price: number): void {
	console.log(`${product}:${price}`);
}
cart("milk",129);
cart("apple",99);
cart("chips",49);
//將相關或相似的資料提供給函式,輸出就會顯示各個參數的資料,也用不著因為每個參數不同,而重複寫三次函式

箭頭函式

除了一般函式寫法外,函式也可以以箭頭來表達:

//正規寫法:
function calculateArea(radius: number): number {
  return radius * radius * Math.PI;
}

//箭頭函式寫法:
const calculateAreaArrow = (radius: number): number => {
  return radius * radius * Math.PI;
};

除此之外,箭頭函式也能簡化寫法:

//簡化寫法:
const calculateAreaArrow = (radius: number): number => radius*radius*Math.PI;
//當箭頭函式只有一個表達式時,可以將大括號及return省略

簡化寫法看著很懶人又方便,但剛學的話,還是建議寫正規做法比較好啦,畢竟萬一一開始就用簡化寫法,指不定自己回頭也看不懂來著。


小結

今天先簡單介紹了函式的表達及寫法,因為函式的內容有些多,我想分成兩天來做介紹,明天會來介紹可選參數(Optional Parameter)、預設參數(Default Parameter)和剩餘參數(Rest Parameter) 的差別,各位明天見!


上一篇
[Day-8] 型別別名x介面
下一篇
[Day-10] 函式(function)-2
系列文
從零開始學習TypeScript:菜鳥的入門介紹與概覽22
圖片
  熱門推薦
圖片
{{ item.channelVendor }} | {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言